<template>
  <el-row>
    <el-col :span="2">
      <div class="grid-content bg-purple-dark">&emsp;</div>
    </el-col>
    <el-col :span="20">
      <div class="grid-content bg-purple-dark">
        <el-container>
   
          <el-main>
            <template>
              <!-- 加载还款信息表 -->
              <el-table :data="repayList"  style="width: 100%">
                <el-table-column prop="debitId" label="借款表单编号" width="105">
                </el-table-column>
                <el-table-column
                  prop="contractId"
                  label="合同签订ID"
                  width="105"
                >
                </el-table-column>
                <el-table-column
                  prop="debitStatus"
                  label="审核状态"
                  width="105"
                >
                </el-table-column>

                <el-table-column
                  prop="debitRequestLimit"
                  label="申请金额"
                  width="105"
                >
                </el-table-column>

                <el-table-column
                  prop="debitApproveLimit"
                  label="借款审批额度"
                  width="105"
                >
                </el-table-column>
          
               

                <el-table-column
                  prop="debitSumExpires"
                  label="还款总期数"
                  width="105"
                >
                </el-table-column>
    
                <el-table-column prop="operation1" label="操作" width="110">
                    <template slot-scope="scope" >
                    <el-button
                      type="primary"
                      round
                      size="mini"
                      style="width: 100px"
                      @click="toUserInfos(scope.row.contractId)"
                      >个人信息补充
                      </el-button >
                     </template>

                </el-table-column>

                <el-table-column prop="operation2" label="操作" width="105">
                  
                    <template slot-scope="scope">
                    <el-button
                      type="primary"
                      round
                      size="mini"
                      style="width: 90px"
                      @click="toDocument(scope.row.productId)"
                      >资料上传
                      </el-button >
                    </template>
                </el-table-column>

                <el-table-column prop="operation3" label="操作" width="105">
                  
                  <template slot-scope="scope">
                  <el-button
                    type="primary"
                    round
                    size="mini"
                    style="width: 90px"
                    @click="toContract(scope.row.debitId)"
                    >签订合同
                    </el-button >
                  </template>
              </el-table-column>


               
              </el-table>
            </template>
           
          </el-main>
        </el-container>
      </div>
    </el-col>
    <el-col :span="2">
      <div class="grid-content bg-purple-dark">&emsp;</div>
    </el-col>
  </el-row>
</template>

<script>

export default {
  data() {
    return {

      seen1:true,
      userAndPage: {
        //传给后端的值
        userId: "",
        currentPage: 1,
        pageSize: 20,
      },
      repayList: [], //还款列表
      topInfo: {
        contractNo: 1,
        repayPayable: 1,
        totalRepayAlready: 1,
      },
      title1: "合同数量",
      title2: "应还总额",
      title3: "已还本金",
      title4: "已还期数",
      title5: "本月应还",
      screenHeight: document.documentElement.clientHeight + "px",
      page: {
        pageSizes: [2, 5, 10],
        total: 0,
      },
      query: {
        currentPage: 1,
        pageSize: 2,
        realName: "",
        dateRange: [],
      },
      userinfo:{

      }

      
    };
  },

  methods: {
    //加载当前用户的借款申请表
    loadDebitList() {
      this.$axios.post("/debit/find",this.userAndPage).then((res) => {
        if (res.data.code == 200) {
          this.repayList = res.data.data.pageInfo.list;
          // console.log(this.repayList[0].debitId);
        } else {
          this.$message.error("操作错误");
        }
      });
    },

    loadRepayList() {
      this.$axios.post("/repay/query", this.userAndPage).then((res) => {
        if (res.data.code == 200) {
          this.repayList = res.data.data.repayList;
          this.topInfo = res.data.data.topInfo;
          this.page.total = res.data.data.total;
   
          for (let i = 0; i < this.repayList.length; i++) {
            this.repayList[i].productRate =
              this.repayList[i].productRate * 100 + "%";
          }
        } else {
          this.$message.error("操作错误");
        }
      });
    },


    //签订合同
    toContract(a) {
      localStorage.setItem("debitId",a);
      this.$router.push("/Contr");
    },


    // toContract(id) {
    //   // this.$axios.get("/contract/" + id).then((res) => {
    //   //           this.user = res.data.data.user;
    //   //           this.$router.push("/Contract");
    //   //       });
    //   this.$router.push("/Contract");
    // },
    toRepayInfo(id) {
      this.$router.push("/RepayInfo");
    },

    //开始信息填写路由
    toUserInfos(userId) {
      this.$router.push("/UserXINXI");
    },
    //对借款材料提交
    toDocument(userId) {
      alert(userId)
      sessionStorage.setItem("productId",userId);
      this.$router.push("/Document");
    },


    // toOverDue() {
      toDebitInfo(userId) {
      this.$router.push("/DebitInfo");
    },
    // },
    handleSizeChange(val) {
      //当每页数据改变时
      this.query.pageSize = val;
      this.loadRepayList();
    },
    handleCurrentChange(val) {
      //当点击页码时
      this.query.currentPage = val;
      this.loadRepayList();
    },

   
  },

  mounted() {
    this.userAndPage.userId = JSON.parse(sessionStorage.getItem("user")).userId;
    console.log(this.userAndPage.userId);
    this.loadDebitList();
  },
 
  beforeDestroy() {
    EventBus.$emit("aaa", 1);
  },
};
</script>
<style >
.succbutton {
    margin: 10px auto;
    margin-left: 60px;
}

</style>
